{% extends "base.html" %}

{% block title %}首页 - 个人博客{% endblock %}

{% block content %}
<div class="text-center mb-8">
    <h1 class="text-4xl font-bold text-gray-800 mb-4">欢迎来到我的博客</h1>
    <p class="text-gray-600">分享技术、生活与思考</p>
</div>

{% if articles %}
    <div class="space-y-6">
        {% for article in articles %}
            <article class="bg-white rounded-lg shadow-md p-6">
                <h2 class="text-2xl font-bold text-gray-800 mb-2">
                    <a href="{{ url_for('article_detail', article_id=article[0]) }}" 
                       class="hover:text-blue-600 transition duration-300">
                        {{ article[1] }}
                    </a>
                </h2>
                <p class="text-gray-600 mb-4">{{ article[2] }}</p>
                <div class="flex justify-between items-center text-sm text-gray-500">
                    <span><i class="far fa-clock mr-1"></i>{{ article[3] }}</span>
                    <a href="{{ url_for('article_detail', article_id=article[0]) }}" 
                       class="text-blue-600 hover:text-blue-800">
                        阅读全文 <i class="fas fa-arrow-right ml-1"></i>
                    </a>
                </div>
            </article>
        {% endfor %}
    </div>
{% else %}
    <div class="text-center py-12">
        <i class="fas fa-blog text-6xl text-gray-300 mb-4"></i>
        <h3 class="text-xl text-gray-500 mb-2">暂无文章</h3>
        <p class="text-gray-400">前往管理页面添加第一篇博客文章</p>
    </div>
{% endif %}
{% endblock %}
